<!DOCTYPE html>
<html lang="en">
<head>
    <title>就诊评价</title>
    <titleType style="display: none;">index</titleType>
    <%- include('../../_global/baseLibs') %>

    <style>
  .service-comment {
     background: #fff; 
  }
  .service-comment .fwpj-out-box {
  /* background: #fff; */
   padding-top: 0px; 
 
  }
  .service-comment .fwpj-out-box .fwpj-box {
      text-align: center; 
    }
    .service-comment .fwpj-out-box .fwpj-box .img-box {
        display: inline-block;
        width: 3.75rem;
        height: 3.75rem;
        border-radius: 50%;
        overflow: hidden; 
      }
      .service-comment .fwpj-out-box .fwpj-box .img-box img {
          width: 100%;
          height: 100%; 
        }
        .service-comment .fwpj-out-box .fwpj-box .name-con {
        font-size: 1.05rem;
        color: #333; }
      .service-comment .pj-text-box {
         margin: 0 0.5rem;
     }
 .service-comment .pj-text-box > textarea {
    
     border: 1px solid #A9A9A9; 
    }
.service-comment .zhpj-box {
    padding-bottom: 1rem;
    margin: 0 0.5rem;
    position: relative; }
    .service-comment .zhpj-box .zhpj-title {
      margin-bottom: 0.5rem;
      padding-left: 2rem;
      position: relative;
      height: 2.5rem;
      line-height: 2.5rem; }
      .service-comment .zhpj-box input[type=checkbox] {
      -webkit-appearance: none;
      appearance: none;
      width: 1.45rem;
      height: 1.45rem;
      margin: 0;
      cursor: pointer;
      vertical-align: middle;
      background: #fff;
      border: 1px solid #a19e9a;
      -webkit-border-radius: 1px;
      -moz-border-radius: 1px;
      border-radius: 1px;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      position: absolute;
      left: 0;
      top: 0.4rem; }
      .service-comment .zhpj-box .zhpj-title .right-text {
        float: right;
        color: #666; }
         .service-comment .zhpj-box .zhpj-title {
      margin-bottom: 0.5rem;
      padding-left: 2rem;
      position: relative;
      height: 2.5rem;
      line-height: 2.5rem; }
      .service-comment .zhpj-box .zhpj-title:after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        right: auto;
        top: auto;
        height: 1px;
        width: 100%;
        background-color: #cfcfcf;
        display: block;
        z-index: 15;
        transform-origin: 50% 100%; }
        @media only screen and (-webkit-min-device-pixel-ratio: 2) {
          .service-comment .zhpj-box .zhpj-title:after {
            transform: scaleY(0.5); } }
        @media only screen and (-webkit-min-device-pixel-ratio: 3) {
          .service-comment .zhpj-box .zhpj-title:after {
            transform: scaleY(0.33); } }
      .service-comment .pj-box {
    display: block;
    line-height: 2rem; }
    .service-comment .pj-box span {
      display: inline-block;
      font-size: 0.9rem;
      width: 5.45rem; }
      .service-comment .pj-box span {
      display: inline-block;
      font-size: 0.9rem;
      width: 5.45rem; }
       .service-comment .pj-box .star-box {
      display: inline-block;
      position: relative;
      vertical-align: middle; }
      .service-comment .pj-box .star-box > ul > li {
        float: left; }
        .service-comment .pj-box .star-box > ul > li > a.star {
          width: 1.4rem;
          height: 1.4rem;
          background: url("/static/images/gray-star.png") no-repeat;
          background-size: cover;
          vertical-align: middle;
          display: inline-block;
          float: left;
          margin-right: 0.5rem; }
        .service-comment .pj-box .star-box > ul > li.active a.star {
          background: url("/static/images/red-star.png") no-repeat;
          background-size: cover; }
          a {
   
          color: #0088cc; 
        }
        .service-comment .zhpj-box input[type=checkbox]:checked::after {
        content: '';
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -0.5rem;
        margin-top: -0.25rem;
        width: 1.175rem;
        height: 0.75rem;
        background: url("/static/images/yes-blue.png") no-repeat;
        background-size: cover; }
    </style>
    <script src="/static/js/crypto-js.js"></script>
    <script src="/static/lib/touchslider.js"></script>
    <script>

        var page_jzpj = (function($, page_jzpj) {
            var key = "jkcs";

            $.JkcsUserInfo.getUserInfoGzd({
                callback: function(userInfo){
                    page_jzpj.userInfo = userInfo;
                }
            });

            page_jzpj.init = function(cfg){
              var yyDetail = StoreCache.getCache("YYGH_YYDETAILINFO");
              $(".name-con").html(yyDetail["docName"]);
              $("#tjpj").on("click",tjpj);
              var $star = $(".star-box");

        $star.each(function(index){
            //console.log(index);
            var $li = $(this).find("li");
            var $active = $(this).find("active");
            var i = iScore = iStar = 0;
            $li.click(function()
            {
                var index = $(this).index()+1;
                var el=$(this).parent().parent().next();
                iStar = $(this).index()+1;
                curPoint($li,index);

                $li.parent().parent().attr("value",index);
                if(index==0){
                     el.html('待评价');
                }else if(index==1){
                    el.html(index+"分(差评)");
                }else if(index==2){
                    el.html(index+"分(较差)");
                }else if(index==3){
                    el.html(index+"分(一般)");
                }else if(index==4){
                    el.html(index+"分(满意)");
                }else if(index==5){
                    el.html(index+"分(非常满意)");
                }

            });
            function curPoint($li,pNum)
            {
                if(pNum){
                    iScore = pNum;
                }else{
                    iScore = iStar;
                }
                for (i = 0; i < $li.length; i++)
                {
                    if(i < iScore){
                        $li.eq(i).addClass("active");
                    }else{
                        $li.eq(i).removeClass("active");
                    }
                }
            }
         


        });
               
            }
          function tjpj() {
             var yyDetail = StoreCache.getCache("YYGH_YYDETAILINFO");

           
            var sfnm = 0;
            if($("#ym").prop("checked")){
                sfnm = 1;
            }
            
            var params={};
            params["jgdm"] = yyDetail["hosCode"];
          
            params["yydid"] = yyDetail["orderId"];
            params["ysgh"] = yyDetail["docCode"];
            params["ysxm"] = yyDetail["docName"];
            params["sfnm"] = sfnm;
            params["pjnr"] = $("#text").val();
            $(".star-box").each(function(index,item){
              params[$(this).attr("name")]= $(this).attr("value");

            });

            if(StringUtils.isEmpty(params["pjnr"])){
               $.QuickAlert.alertFail({
                                 content : "请填写评价内容！"
                             });

            }else{
             $.QuickRemote.AjaxJson({
                funcName:"/api/gzd/yygh/fwpj/addFwpj"
                ,callback:function(data) {
                  
                     $.pageSwitch.goToUrl("myOrder","yyDetail","orderId="+yyDetail.orderId+"&hosCode="+yyDetail.hosCode);
                }
                ,params:params
            
            
            });

            }
          }
            return page_jzpj;
        })(jQuery, {});
        $('#tip').click(function(){
        $('#text').focus()
    });
    function clearText(obj)
    {
        $('#tip').hide();
    }
    function text(obj)
    {
        if(obj.value==""){
            $('#tip').show();
        }
    }
    </script>
</head>
<body>
<section class="page-wrap service-comment">

    <div class="fwpj-out-box">
        <div class="fwpj-box">
           <div class="img-box">
               <img src="/static/images/doctor/doc.png" alt="">
           </div>
            <span class="name-con">张宁医生</span>

            <div class="pj-box" >
                <span>总体评价：</span>
                <div class="star-box" name="ztpj" value="">

                    <ul>
                        <li>
                            <a class="star"></a>
                        </li>
                        <li>
                            <a class="star"></a>
                        </li>
                        <li>
                            <a class="star"></a>
                        </li>
                        <li>
                            <a class="star"></a>
                        </li>
                        <li>
                            <a class="star"></a>
                        </li>
                    </ul>
                </div>
                <span class="score" style="width:7.5rem;">待评价</span>
            </div>
        </div>

    </div>
    <div class="pj-text-box">
        <textarea id="text" onfocus="clearText(this)" onblur="text(this);"></textarea>
        <div id="tip">请分享下印象深刻的诊疗过程和评价，给其他的病友帮助。</div>
    </div>

    <div class="zhpj-box">
        <div class="zhpj-title">
            <input id="ym" type="checkbox" name="ym">
            <label for="ym">佚名</label>
            <span class="right-text">您填写的将以佚名方式展现</span>
        </div>
        <div class="pj-box">
            <span>详细评价：</span>
        </div>
        <div class="pj-box">
            <span>医院环境：</span>
            <div class="star-box" name="yyhj" value="">
                <ul>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                </ul>
            </div>
            <span class="score" style="width: 7.5rem;">待评价</span>
        </div>
        <div class="pj-box">
            <span>治疗效果：</span>
            <div class="star-box" name="zlxg" value="">
                <ul>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                </ul>
            </div>
            <span class="score" style="width: 7.5rem;">待评价</span>
        </div>
       
        <div class="pj-box">
            <span>服务态度：</span>
            <div class="star-box" name="fwtd" value=""> 
                <ul>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                </ul>
            </div>
            <span class="score" style="width: 7.5rem;">待评价</span>
        </div>
        <div class="pj-box">
            <span>就医便捷性：</span>
            <div class="star-box" name="jybjx" value="">
                <ul>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                    <li>
                        <a class="star"></a>
                    </li>
                </ul>
            </div>
            <span class="score" style="width: 7.5rem;">待评价</span>
        </div>
    </div>
    <div class="page-info">
       <a href="javascript:void(0)" class="btn btn-big" id="tjpj">提交</a>
    </div>
    
    <!--内容END-->
    <%- include('../../ejs/common/footer') %>
</section>

</body>
</html>
